<template>
	<view class="movie">
		<view class="status_bar">
			<!-- 这里是状态栏 -->
		</view>
		<view class="navTitle">
			
			<view class="titleText">
				<img class="goback" src="~/static/icon/back.png" @tap="goBack">
				<text>{{topTitle}}</text>
				<img class="search" src="~/static/icon/search.png" @tap="search">
			</view>
		</view>
		<view class="movieType">
			<scroll-view scroll-x class="bg-white nav" scroll-with-animation>
				<view class="cu-item"  v-for="(item,index) in orderList" :key="index" :class="{active:TabCur1==index}" @tap="tabSelect1(item,index)" :data-id="index">
					{{item.title}}
				</view>
			</scroll-view>
			<scroll-view scroll-x class="bg-white nav" scroll-with-animation>
				<view class="cu-item"  v-for="(item,index) in extendAreaList" :key="index" :class="{active:TabCur2==index}" @tap="tabSelect2(item,index)" :data-id="index">
					{{item}}
				</view>
			</scroll-view>
			<scroll-view scroll-x class="bg-white nav" scroll-with-animation>
				<view class="cu-item"  v-for="(item,index) in extendYearList" :key="index" :class="{active:TabCur3==index}" @tap="tabSelect3(item,index)" :data-id="index">
					{{item}}
				</view>
			</scroll-view>
			<scroll-view scroll-x class="bg-white nav" scroll-with-animation>
				<view class="cu-item"  v-for="(item,index) in cateChild" :key="index" :class="{active:TabCur4==index}" @tap="tabSelect4(item,index)" :data-id="index">
					{{item.type_name}}
				</view>
			</scroll-view>
			<scroll-view scroll-x class="bg-white nav" scroll-with-animation>
				<view class="cu-item"  v-for="(item,index) in stateList" :key="index" :class="{active:TabCur5==index}" @tap="tabSelect5(item,index)" :data-id="index">
					{{item.title}}
				</view>
			</scroll-view>
		</view>
			
		<!-- 影片 -->
		<view class="content">
			<view class="movie-item" v-for="item in movieList" :key="item.vod_id" @tap="getInfo(item)">
				<span>{{item.vod_score}}分</span>
				<image :src="item.vod_pic" mode="aspectFill"></image>
				<text class="text">{{item.vod_name}}</text>
				<view class="notice" v-if="item.vod_state == '预告'">
					<img src="~/static/icon/notice.png">
					<span>预告</span>
				</view>
			</view>
			<!-- <view class="loading" v-if="isLoading">
				<ul>
					<li></li>
					<li></li>
				</ul>
			</view> -->
		</view>
	
	</view>
</template>

<script>
	var typeid1=1, page=1,typeid=1,limit=12;
	export default{
		data(){
			return{
				TabCur1: 0,
				TabCur2: 0,
				TabCur3: 0,
				TabCur4: 0,
				TabCur5: 0,
				typeid1: 1,
				topTitle:'',
				page:1,
				order:'',
				area:'',
				year:'',
				type:'',
				state:'',
				cateChild:[{
					type_id:'',
					type_name:'全部'
				}],
				orderList:[],
				extendAreaList:[
					"全部"
				],//地区
				extendYearList:[
					'全部'
				],//年代
				stateList:[{
					state:'',
					title:"全部"
				}],
				movieList:[],
				// isLoading:true,
			}
		},
		onLoad:function (option) {
			console.log(option);
			this.typeid1 = option.typeid1;
			if(this.typeid1 == 1){
				this.topTitle = "电影"
			}
			if(this.typeid1 == 2){
				this.topTitle = "电视剧"
			}
			if(this.typeid1 == 3){
				this.topTitle = "综艺"
			}
			if(this.typeid1 == 4){
				this.topTitle = "动漫"
			}
			let typeid = option.typeid;
			if(typeid == 0){
				typeid = ''
			}
			this.type = typeid;
			this.TabCur4 = option.index-1+2;
			console.log(this.TabCur4);
			uni.request({
				url: 'http://221.234.36.126:82/api.php/Login/visitor_login',
				method: 'POST',
				data: {
					token: '1CECE2221211DDCB613882C3311EC670'
				},
				header: {
					'content-type': 'application/json;charset=UTF-8'
				},
				success: (res) => {
					// console.log(res.data);
					let visitor = res.data.data.hash;
					uni.request({
						url: 'http://221.234.36.126:82/api.php/Vod/get_vod_cate',
						method: 'POST',
						data: {
							token: '1CECE2221211DDCB613882C3311EC670',
							// page: 1,
							hash: visitor,
							type_id_1: this.typeid1,
							// type_id: 10
						},
						header: {
							'content-type': 'application/json;charset=UTF-8'
						},
						success: (res) => {
							console.log(res)
							this.cateChild= this.cateChild.concat(res.data.data.cate_child);
							this.orderList=res.data.data.order;
							this.extendAreaList= this.extendAreaList.concat(res.data.data.vod_extend_area);
							this.extendYearList= this.extendYearList.concat(res.data.data.vod_extend_year);
							this.stateList= this.stateList.concat(res.data.data.vod_state);
							// console.log(this.extendAreaList)
							uni.request({
								url: 'http://221.234.36.126:82/api.php/Vod/ajax_video',
								method: 'POST',
								data: {
									token: '1CECE2221211DDCB613882C3311EC670',
									hash: visitor,
									type_id_1: this.typeid1,
									limit:limit,
									type_id:this.type
								},
								header: {
									'content-type': 'application/json;charset=UTF-8'
								},
								success: (res) => {
									// console.log(res.data)
									this.movieList=res.data.list
								}
							})
						}
					})
				}
			});
		},
		// 上拉加载
		onReachBottom() {
			let _self = this
			page++
			
			uni.request({
				url: 'http://221.234.36.126:82/api.php/Vod/ajax_video',
				method: 'POST',
				data: {
					token: '1CECE2221211DDCB613882C3311EC670',
					page: page,
					type_id_1: typeid1,
					limit:limit
				},
				header: {
					'content-type': 'application/json;charset=UTF-8'
				},
				success: (res) => {
					// console.log(res.data)
					// if (res.data.list == ""||res.data.list==null) {
					// 	uni.hideNavigationBarLoading();
					// 	_self.isLoading=false;
					// 	return false;
					// }
					_self.movieList = _self.movieList.concat(res.data.list);
					uni.hideNavigationBarLoading();
				}
			})
		},
		methods:{
			goBack(){
				uni.switchTab({
					url: "/pages/classes/classes",
				});
			},
			search(){
				uni.navigateTo({
					url: "/pages/search/search",
				});
			},
			// 影片详情页
			getInfo(item) {
				let vodId=item.vod_id
				uni.navigateTo({
					url: '/pages/videoInfo/videoInfo?id='+vodId
				});
			},
			tabSelect1(item,index) {
				this.TabCur1 = index;
				this.order= item.order;
				uni.request({
					url: 'http://221.234.36.126:82/api.php/Vod/ajax_video',
					method: 'POST',
					data: {
						token: '1CECE2221211DDCB613882C3311EC670',
						type_id_1: this.typeid1,
						type_id:this.type,
						limit:limit,
						order:this.order,
						area:this.area,
						year:this.year,
						state:this.state
					},
					header: {
						'content-type': 'application/json;charset=UTF-8'
					},
					success: (res) => {
						console.log(res)
						this.movieList=res.data.list
						// if(this.movieList==""){
						// 	this.isLoading=false;
						// }
					}
				})
			},
			tabSelect2(item,index) {
				this.TabCur2 = index;
				if(item == '全部'){
					item = ''
				}
				this.area=item;
				console.log(this.area);
				uni.request({
					url: 'http://221.234.36.126:82/api.php/Vod/ajax_video',
					method: 'POST',
					data: {
						token: '1CECE2221211DDCB613882C3311EC670',
						type_id_1: this.typeid1,
						type_id:this.type,
						limit:limit,
						order:this.order,
						area:this.area,
						year:this.year,
						state:this.state
					},
					header: {
						'content-type': 'application/json;charset=UTF-8'
					},
					success: (res) => {
						console.log(res.data);
						this.movieList=res.data.list
					}
				})
			},
			tabSelect3(item,index) {
				this.TabCur3 = index
				if(item == '全部'){
					item = ''
				}
				this.year=item
				uni.request({
					url: 'http://221.234.36.126:82/api.php/Vod/ajax_video',
					method: 'POST',
					data: {
						token: '1CECE2221211DDCB613882C3311EC670',
						type_id_1: this.typeid1,
						type_id:this.type,
						limit:limit,
						order:this.order,
						area:this.area,
						year:this.year,
						state:this.state
					},
					header: {
						'content-type': 'application/json;charset=UTF-8'
					},
					success: (res) => {
						// console.log(res.data.list);
						this.movieList=res.data.list
					}
				})
			},
			tabSelect4(item,index) {
				this.TabCur4 = index;
				this.type=item.type_id;
				// console.log(typeid)
				uni.request({
					url: 'http://221.234.36.126:82/api.php/Vod/ajax_video',
					method: 'POST',
					data: {
						token: '1CECE2221211DDCB613882C3311EC670',
						type_id_1: this.typeid1,
						type_id:this.type,
						limit:limit,
						order:this.order,
						area:this.area,
						year:this.year,
						state:this.state
					},
					header: {
						'content-type': 'application/json;charset=UTF-8'
					},
					success: (res) => {
						// console.log(res)
						this.movieList=res.data.list
					}
				})
			},
			tabSelect5(item,index) {
				
				this.TabCur5 = index
				this.state=item.state
				uni.request({
					url: 'http://221.234.36.126:82/api.php/Vod/ajax_video',
					method: 'POST',
					data: {
						token: '1CECE2221211DDCB613882C3311EC670',
						type_id_1: typeid1,
						type_id:this.type,
						limit:limit,
						order:this.order,
						area:this.area,
						year:this.year,
						state:this.state
					},
					header: {
						'content-type': 'application/json;charset=UTF-8'
					},
					success: (res) => {
						// console.log(res.data.list)
						this.movieList=res.data.list
					}
				})
			}
			
			
		}
	}
</script>

<style>
	@import url("movie.css");
</style>
